<script setup>
import { } from 'vue'

const props = defineProps({
  subCount: {
    type: Number
  },
  shareCount: {
    type: Number
  }
})

</script>

<template>
  <div class="music-video-btn">
    <div class="handle-button">
      <el-button>
        <template #icon>
          <i class="iconfont icon-dianzan"></i>
        </template>
        <template #default>
          点赞
        </template>
      </el-button>
      <el-button>
        <template #icon>
          <i class="iconfont icon-shoucang"></i>
        </template>
        <template #default>
          收藏（{{ props.subCount }}）
        </template>
      </el-button>
      <el-button>
        <template #icon>
          <i class="iconfont icon-fenxiang"></i>
        </template>
        <template #default>
          分享（
          {{ props.shareCount }}
          ）
        </template>
      </el-button>
    </div>

  </div>
</template>

<style scoped lang='scss'>
.music-video-btn {
  margin-top: 20px;

  .handle-button {
    button {
      margin-right: 20px;
      line-height: 40px;
      border-radius: 20px;
    }

    .icon-dianzan {
      font-size: 18px;
    }

    .icon-shoucang {
      font-size: 23px;
    }

    .icon-fenxiang {
      font-size: 20px;
    }
  }
}
</style>
